评论区

实现方法

通过 localized-footer 为每一个页面的末尾增加一段 html 代码：

{
  "plugins": ["localized-footer"],
  "pluginsConfig": {
    "localized-footer": {
      "filename": "gitbook/comment.html"
    }
  }
}

参数介绍

创建目录用于存放相关文件，我创建了目录 gitbook 用于存放相关文件，文件名为 comment.html 。

我们先单独看一下评论区控件的代码：

const gitalk = new Gitalk({
  clientID: 'GitHub Application Client ID',
  clientSecret: 'GitHub Application Client Secret',
  repo: 'GitHub repo',
  owner: 'GitHub repo owner',
  admin: [
    'GitHub repo owner and collaborators, only these guys can initialize github issues'
  ],
  createIssueManually: true,
  id: document.title
})

clientID 和 clientSecret 需要通过在 GitHub 上注册获得：https://github.com/settings/applications/new

由于评论区与 GitHub issue 关联，所以需要为每个页面创建一个 issue ，createIssueManually: true 使得管理员能够一键创建 issue ，issue 的标题为 id ，这里使用 document.title 作为页面 id 。

快速生成

1. 修改 profile.conf ，将参数修改为你自己的。注意格式不要乱，因为这一段将被直接嵌入 html 。
2. 执行 set_file.sh ， gitbook/comment.html 将自动根据 profile.conf 生成。

参考代码

当然，你也可以复制我的代码。由于未知的原因（我太菜），下面那段代码需要两次 const gitalk = new Gitalk 填写两次参数，如果有更好的实现方式请提出，谢谢。

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css"
/>
<script src="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>
<div id="gitalk-container" style="margin: 5%"></div>
<script>
  const gitalk = new Gitalk({
    clientID: '"GitHub Application Client ID"',
    clientSecret: 'GitHub Application Client Secret',
    repo: 'GitHub repo',
    owner: 'GitHub repo owner',
    admin: [
      'GitHub repo owner and collaborators, only these guys can initialize github issues'
    ],
    createIssueManually: true,
    id: document.title
  })
  gitalk.render('gitalk-container')
</script>
<script>
  require(['gitbook'], function(gitbook) {
    const gitalk = new Gitalk({
      clientID: 'GitHub Application Client ID',
      clientSecret: 'GitHub Application Client Secret',
      repo: 'GitHub repo',
      owner: 'GitHub repo owner',
      admin: [
        'GitHub repo owner and collaborators, only these guys can initialize github issues'
      ],
      createIssueManually: true,
      id: document.title
    })
    gitbook.events.bind('page.change', initMygitalk)
    function initMygitalk() {
      gitalk.render('gitalk-container')
    }
  })
</script>